<?php if(isset($imageList)) :?>
<?php 
$this->Html->script('fancybox/jquery.mousewheel-3.0.4.pack.js', array('block' => 'script'));
$this->Html->script('fancybox/jquery.fancybox-1.3.4.pack.js', array('block' => 'script'));
$this->Html->css('/js/fancybox/jquery.fancybox-1.3.4.css', array('block' => 'css'));
?>
<div class="row">
<?php 
foreach($imageList as $key=>$image) :
	if($key && $key % 4 == 0) :
		echo '</div>';
		echo '<div class="row">';
	endif;
?>
	<div class="col-lg-3 home-product gallery-row">
		<div class="product-list gallery">
			<a href="/files/images/<?=$folder.'/'.$image?>" rel="example_group">
				<img src="/files/images/<?=$folder.'/'.$image?>" width="145" height="120">
			</a>
		</div>        	
	</div>
<?php endforeach;?>
</div>
<script>
$(document).ready(function() {
	$("a[rel=example_group]").fancybox({
		'transitionIn'		: 'none',
		'transitionOut'		: 'none',
		'titlePosition' 	: 'over',
		'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
			return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
		}
	});
});
</script>
<?php endif;?>
